<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>显示模式</title>
		<style>
			.box6{
				width:200px;
				height:200px;
				border:1px solid red;
				margin:100px auto 80px; 
			}
		</style>
	</head>
	<body>
		<!-- 
		元素的显示模式：
		1.块元素--block
			比较霸道，单独占一行
			默认情况宽度和父级元素一样宽
			可以给元素设置宽、高和水平居中
			块元素中可以包含行内元素和块元素
		2.行内元素--inline
			一行可显示多个
			默认宽度由内容填充，内容多宽元素多宽
			宽、高、水平居中属性不适用
			行内元素只能容纳文本或其他行内元素
		3.行内块元素
		转换方法：display:inlne-block;
		 -->
		<div>
		<img src="" />
		<h3>hello</h3>
		<p class="box6">hello 段落</p>
		<span class="box6">2399</span>
		<span>2499</span>
		<a href="#">这是链接</a>
		</div>
	</body>
</html>